/**
 * Copyright (c) 快宝网络 kuaidihelp.com Co., Ltd. All Rights Reserved 禁止外泄以及用于其它的商业用途
 */

import React from 'react';
import { Card, Space, Button } from 'antd';
import { PageContainer } from '@ant-design/pro-layout';
import { connect } from 'umi';
import type { ConnectState } from '@/models/connect';
import { useAppLoginCheck } from '@/components/_pages/tools/appLoginCheck/_utils';
import LoginSearchForm from '@/components/_pages/tools/appLoginCheck/search';
import AppLoginList from '@/components/_pages/tools/appLoginCheck/loginList';
import YzLoginList from '@/components/_pages/tools/appLoginCheck/yzLoginList';
import DeviceLoginList from '@/components/_pages/tools/appLoginCheck/deviceLoginList';

const Index = () => {
  const { columns, dataSource, onSearch, onReset, onUnfreeze } = useAppLoginCheck();

  return (
    <PageContainer>
      <LoginSearchForm onSearch={onSearch} onReset={onReset} />
      <AppLoginList columns={columns} data={dataSource} />
      <YzLoginList data={dataSource} />
      <DeviceLoginList data={dataSource} />
      {dataSource?.id ? (
        <Card style={{ textAlign: 'center' }}>
          <Space>
            <Button type='primary' onClick={onUnfreeze}>
              解除限制
            </Button>
          </Space>
        </Card>
      ) : null}
    </PageContainer>
  );
};

export default connect(({ global }: ConnectState) => ({
  winSize: global.winSize || '',
}))(React.memo(Index));
